<template>
	<div class="createGrope w944">
		<alert ref="alert"></alert>
		<div class="label_top">
			<p>{{updateTitle}}</p>
			<em @click="reBack">返回</em>
		</div>
		<div class="auditGrope">
			<em class="tit" style="line-height: 33px;">小组名称：</em>
			<input type="text" placeholder="输入小组名称" v-model="name" v-if="nowType!='see'"/>
			<span v-if="nowType=='see'" style="color: #333;line-height: 33px;font-size: 15px;">{{name}}</span>
		</div>
		<div class="auditGrope">
			<em class="tit">审核员：</em>
			<div class="auditPeople" v-show="auditPbefore">
				<a @click="addAuditPersonnel">添加</a>
			</div>
			<div class="auditPeople" v-show="auditPafter">
				<a @click="peopleEdit" v-if="nowType!='see'">编辑</a>
				<div class="pepCon">
					<span v-for="(item,index) in this.peopleSelectNames" :key="index" class="personHover">
						<a @click="peopleDelete(index)" v-if="nowType!='see'">&#10005;</a>
						<el-popover placement="right" trigger="hover">
  							<p slot="reference" @mouseenter="enter(item,index)">{{item.peopleName}}</p>
  							<div class="infoDetail">
  								<div class="iconImg">
									<img :src="hover_headimg"/>
									<span>{{hover_nickname}}</span>
									<span>{{hover_gradeRuleName}}</span>
								</div>
								<span>账号/手机号：{{hover_phone}}</span>
								<span>组织机构：{{hover_organizationName}}</span>
								<span>部门：{{hover_departmentName}}</span>
								<span>岗位：{{hover_stationName}}</span>
								<span>用户分类：{{hover_roleLabel}}</span>
  							</div>
						</el-popover>
					</span>
				</div>
			</div>
		</div>
		<div class="auditGrope">
			<em class="tit">审核权限：</em>
			<div class="auditBefore" v-show="auditQxBefore">
				<a @click="auditColumn">添加</a>
			</div>
			<div class="auditBefore" v-show="auditQxAfter">
				<a @click="auditEditSeen">编辑查看</a>
			</div>
		</div>
		<div class="auditGrope">
			<em class="tit">被审核讲师：</em>
			<div class="auditBefore" v-show="auditTeaBefore">
				<a @click="auditTeacher">添加</a>
			</div>
			<div class="auditBefore" v-show="auditTeaAfter">
				<a @click="auditTeaEdit" v-if="nowType!='see'">编辑</a>
				<div class="pepCon">
					<span v-for="(item,index) in this.lecturerNames" :key="index" class="personHover">
						<a @click="teacherDelete(index)" v-if="nowType!='see'">&#10005;</a>
						<el-popover placement="right" trigger="hover">
  							<p slot="reference" @mouseenter="enter(item,index)">{{item}}</p>
  							<div class="infoDetail">
  								<div class="iconImg">
									<img :src="hover_headimg"/>
									<span>{{hover_nickname}}</span>
									<span>{{hover_gradeRuleName}}</span>
								</div>
								<span>账号/手机号：{{hover_phone}}</span>
								<span>组织机构：{{hover_organizationName}}</span>
								<span>部门：{{hover_departmentName}}</span>
								<span>岗位：{{hover_stationName}}</span>
								<span>用户分类：{{hover_roleLabel}}</span>
  							</div>
						</el-popover>
					</span>
				</div>
			</div>
		</div>
		<div class="auditGrope">
			<em class="tit">消息通知：</em>
			<div class="notice">
				<em class="tit">审核员通知：</em>
				<el-checkbox-group v-model="taskNotice" @change="selectTaskNoticeArr" :disabled="nowType=='see'"> 
    				<el-checkbox v-for="item in taskNoticeArr" :key="item.id" :label="item.id">{{item.name}}</el-checkbox>
 				</el-checkbox-group>  
 				<p>通知样式：您已被邀请成为《%name%》小组课程审核员，请点击查看。</p>
			</div>
		</div>
		<div class="footerButton">
			<a @click="checkSave" v-show="nowType!='see'" v-bind:style="{background: clickLock==true ? '#44CEF6' : '#3a8ee6'}">保存</a>
			<a @click="cancel" class="cancel" v-show="nowType!='see'">取消</a>
		</div>

		<!--选择审核人员弹窗-->
		<div class="courseSelectWrap" v-show="peopleSelectWrap">
			<a @click="peopleSelectClose" class="courseSelectClose">&#10005;</a>
			<p>选择人员</p>
			<div class="courseSelectLine">
				<el-cascader v-model="value" :options="cityArr" :props="optionProps" class="th_2" placeholder="选择地区" @change="cityArrChange"></el-cascader>
				<div class="msearch">
					<input placeholder="请输入用户账号、姓名……" v-model="studyKeySearch"/>
					<a @click="getKcCircleListPeople"><img src="../../assets/qudaoImg/search.png"/></a>
				</div>
			</div>
			<div class="userContent clearFix">
				<div class="leftContent">
					<el-input placeholder="查找组织机构、部门" v-model="filterText"></el-input>
					<el-tree :data="organizationArr" :props="defaultProps" @node-click="handleNodeClick" :filter-node-method="filterNode" ref="tree" :default-expanded-keys="[dataId]" node-key="id"></el-tree>
				</div>
				<div class="rightContent">
					<el-table ref="multipleTable" :data="tableData" border @selection-change="handleSelectionChangePeople">
						<el-table-column type="selection"></el-table-column>
						<el-table-column prop="nickname" label="姓名" width="100"></el-table-column>
						<el-table-column prop="organizationResultName" label="组织"></el-table-column>
						<el-table-column prop="stationName" label="岗位" width="150"></el-table-column>
					</el-table>
					<div class="studyPag">
						<el-pagination @current-change="handleCurrentChange" :current-page= "currentpage" :page-size="pagesize" layout="prev, pager, next" :total="total"></el-pagination>
					</div>
				</div>
			</div>
			<div class="footerButton">
				<a @click="peopleSelectWrapSubmit">确定</a>
				<a @click="peopleSelectClose" class="cancel">取消</a>
			</div>
		</div>
		<!--选择审核栏目组-->
		<div class="auditColumnWrap" v-show="auditColumnWrap">
			<a @click="auditColumnClose" class="auditColumnClose">&#10005;</a>
			<p>审核权限</p>
			<el-cascader v-model="value1" :options="options" :props="optionPropsClass" clearable @change="selectAuditGrope" placeholder="请选择审核权限"></el-cascader>
			<div class="footerButton">
				<a @click="auditColumnSubmit">确定</a>
				<a @click="auditColumnClose" class="cancel">取消</a>
			</div>
		</div>
		<!--选择审核讲师弹窗-->
		<div class="teacherSelect" v-show="teacherSelect">
			<a @click="teacherSelectClose" class="teacherSelectClose">&#10005;</a>
			<p>选择讲师</p>
			<el-table ref="multipleTable1" :data="tableDataTeacher" border @selection-change="handleSelectionTeacher">
				<el-table-column type="selection"></el-table-column>
				<el-table-column prop="nickname" label="讲师"></el-table-column>
				<el-table-column prop="phone" label="手机号"></el-table-column>
			</el-table>
			<div class="studyPag">
				<el-pagination @current-change="handleCurrentChangeTeacher" :current-page="currentpage" :page-size="pagesize" layout="prev, pager, next" :total="total"></el-pagination>
			</div>
			<div class="footerButton">
				<a @click="teacherSelectSubmit">确定</a>
				<a @click="teacherSelectClose" class="cancel">取消</a>
			</div>
		</div>
	</div>
</template>
<script>
	import alert from '../../components/Alert.vue';
	export default{
		data(){
			return{
				nowType:'',
				updateTitle:'',
				
				id:'',
				clickLock:true,
				name:'',
				value1: [],
				auditPbefore:true,
				auditPafter:false,
				peopleSelectWrap:false,
				
				auditQxBefore:true,
				auditQxAfter:false,
				auditColumnWrap:false,
				pcolumn:[],
				ccolumn:[],
				qxArr:[],
				
				auditTeaBefore:true,
				auditTeaAfter:false,
				teacherSelect:false,
				tableDataTeacher:[],
				multipleSelectionTeacher:[],
				teacherSelectNamesMul:[],
				lecturerids:'',
				lecturerNames:[],
				
				taskNotice:[],
				taskNoticeArr:[{
					id:1,
					name:'APP通知'
				},{
					id:2,
					name:'短信通知'
				},{
					id:3,
					name:'邮件通知'
				}],
				taskNoticeIds:[],
				

				
				courseSelectIds:'',
				courseSelectNamesMul:[],
				courseSelectNames:[],
				openOrClose:'',
				starttime:'',
				endtime:'',
				
				studyNotice:[],
				studyNoticeArr:[{
					id:1,
					name:'APP通知'
				},{
					id:2,
					name:'短信通知'
				},{
					id:3,
					name:'邮件通知'
				}],
				studyNoticeIds:[],

				auditPeople:true,
				courseAfter:false,
				courseSelectWrap:false,
				courseClassify: '',
				options: [],
				optionPropsClass: {
				    value: 'id',
				    label: 'columnName',
				    children: 'childList',
					multiple: true
				},
				studyKeySearch:'',
				tableDataWrap:[],
				multipleSelection: [],
				multipleSelectionName: [],

				
				
				dataId:'',
				cityArr:[],
				value: [],
				tableData:[],
				optionProps: {
					value: 'id',
					label: 'name',
					children: 'list',
					checkStrictly: true
				},
				filterText: '',
				organizationArr:[],
				defaultProps: {
          			children: 'childrenList',
          			label: 'name'
        		},
        		proviceid:'',
        		cityid:'',
        		regionid:'',
        		peopleSelectIds:'',
        		peopleSelectNames:[],
				peopleSelectNamesMul:[],
				multipleSelectionPeople: [],
				multipleSelectionNamePeople: [],
				courseSelectNamesMulPeople:[],

				hover_headimg:'',
				hover_nickname:'',
				hover_gradeRuleName:'',
				hover_phone:'',
				hover_organizationName:'',
				hover_departmentName:'',
				hover_stationName:'',
				hover_roleLabel:'',


				pagesize: 15,
		        currentpage: 1,
		        total: 1,
				multipleTableCourse:[]
			}
		},
		methods:{
			getParams() {
				let that = this;
				var routerParams = this.$route.params.type;
				if(routerParams == 'edit') {
					this.nowType = 'edit';
					this.updateTitle = "编辑小组";
				}else if(routerParams == 'see') {
					this.nowType = 'see';
					this.updateTitle = "查看小组";
				}else{
					this.nowType = 'add';
					this.updateTitle = "创建小组";
				};
			},
//			添加审核权限start
			auditColumn(){
				this.auditColumnWrap = true;
				this.getColumnList();
			},
			auditEditSeen(){
				this.auditColumnWrap = true;
				this.getColumnList();
			},
			getColumnList(){
				let columnType = [1];
				this.$rootFunction().columnList({columnType});
			},
			selectAuditGrope(tags){
				//选择审核权限  即栏目
				this.qxArr = [];
				this.qxArr = tags;
			},
			auditColumnSubmit(){
				this.pcolumn = [];
				this.ccolumn = [];
				this.qxArr.forEach(element=>{
					this.pcolumn.push(element[0]);
					this.ccolumn.push(element[1]);
				});
				this.auditColumnWrap = false;
				this.auditQxBefore = false;
				this.auditQxAfter = true;
			},
			auditColumnClose(){
				this.auditColumnWrap = false;
			},
//			添加审核权限end
//			选择审核讲师start
			auditTeacher(){
				this.teacherSelect = true;
				this.getTeacherList();
			},
			handleSelectionTeacher(val) {
				this.multipleSelectionTeacher = [];
				this.teacherSelectNamesMul = [];
				for(var i = 0;i<val.length;i++){
					this.multipleSelectionTeacher.push(val[i].id);
					this.teacherSelectNamesMul.push(val[i].nickname);
				}
			},
			teacherSelectSubmit(){
				this.lecturerids = this.multipleSelectionTeacher;
				this.lecturerNames = this.teacherSelectNamesMul;
				this.teacherSelect = false;
				this.auditTeaBefore = false;
				this.auditTeaAfter = true;
			},
			teacherSelectClose(){
				this.teacherSelect = false;
			},
			handleCurrentChangeTeacher(value) {
				this.currentpage = value;
				this.getTeacherList();
			},
			getTeacherList(){
				this.$ajax({
					url: this.$root.jifuUrl + "/getLecturePage?"+ 'page=' + this.currentpage + '&num=' + this.pagesize +'&rootcompanyid=1',
					method: 'GET',
					data: {},
					success: res => {
						if(res.data.code == 200) {
							this.tableDataTeacher = res.data.data.list;
							this.total=res.data.data.pageParam.items;
							if(this.nowType=='edit'){
								setTimeout(() => {
								　　 this.rowMultipleChecked();
								}, 200)
							}
						}
					}
				});
			},
			//讲师回显选中结果
			rowMultipleChecked(){
				var selectTeachers=[];
				this.lecturerids.forEach(element =>{
					selectTeachers.push(parseInt(element))
				})
				if(selectTeachers!=null){
					this.tableDataTeacher.forEach(element => {
						if(selectTeachers.indexOf(element.id)>=0){
							this.$refs.multipleTable1.toggleRowSelection(element);
						}
					});
				}
			},
			auditTeaEdit(){
				this.teacherSelect = true;
				this.getTeacherList();
			},
			teacherDelete(index){
				this.lecturerNames.splice(index,1);
				this.lecturerids.splice(index,1);
			},
//			选择审核讲师end
//			选择通知方式start
			selectTaskNoticeArr(){
				this.taskNoticeIds = []; 
				for(var i = 0;i<this.taskNotice.length;i++){
					this.taskNoticeArr.forEach(element => {
						if(element.id==this.taskNotice[i]){
							this.taskNoticeIds.push(element.id);
						}
					});
				}
			},
//			选择通知方式end
			createGrope(){
				let s = {
					rootcompanyid:1,
					name:this.name,
					pcolumn:this.pcolumn.join(','),
					ccolumn:this.ccolumn.join(','),
					userids:this.peopleSelectIds.join(','),
					lecturerids:this.lecturerids.join(','),
					type:this.taskNoticeIds.join(',')
				};
				if(this.clickLock==true){
					this.clickLock=false;
					this.$ajax({
						url: this.$root.jifuUrl + '/addAuditTeam',
						method: 'POST',
						data: this.qs.stringify(s),		
						success: res => {
							if(res.data.code == 200) {
								this.$refs.alert.show({alertText: '保存成功'});
								setTimeout(() =>{
									this.$router.push({
										name:'auditManager'
									});
								},2000)
							}else{
								this.clickLock = true;
								this.failText = res.data.message;
								this.$rootFunction().deleteResFail();
							}
						}
					});
				}
			},
			updateTask(){
				let s = {
					id:this.id,
					rootcompanyid:1,
					name:this.name,
					pcolumn:this.pcolumn.join(','),
					ccolumn:this.ccolumn.join(','),
					userids:this.peopleSelectIds.join(','),
					lecturerids:this.lecturerids.join(','),
					type:this.taskNoticeIds.join(',')
				};
				this.$ajax({
					url: this.$root.jifuUrl + '/updateAuditTeam',
					method: 'POST',
					data: this.qs.stringify(s),		
					success: res => {
						if(res.data.code == 200) {
							this.$refs.alert.show({alertText: '保存成功'});
							setTimeout(() =>{
								this.$router.push({
									name:'auditManager'
								});
							},2000)
						}else{
							this.failText = res.data.message;
							this.$rootFunction().deleteResFail();
						}
					}
				});
			},
			checkSave(){
				if(this.nowType == 'add') {
					this.createGrope();
				}else if(this.nowType == 'edit') {
					this.updateTask();
				}
			},
			cancel(){
				this.$router.go(-1);
			},
			getTreeData(data){
				for(var i=0;i<data.length;i++){
					if(data[i].childList.length<1){
						data[i].childList=undefined;
					}else {
						this.getTreeData(data[i].childList);
					}
				}
				return data;
        	},
//			栏目刷新列表end
//			添加审核人员start
			addAuditPersonnel(){
				this.peopleSelectWrap = true;
				this.getOrganizationArr();
				this.getKcCircleListPeople();
			},
			getOrganizationArr(){
				this.$ajax({
					url: this.$root.jifuUrl + "/getOrganizationInfo?"+'&rootcompanyid=1'+'&proviceid='+this.proviceid+'&cityid='+this.cityid+'&regionid='+this.regionid,
					method: 'GET',
					data: {},
					success: res => {
						if(res.data.code == 200) {
							this.organizationArr = res.data.data;
						}
					}
				});
			},
			filterNode(value, data) {
        		if (!value) return true;
       	 		return data.name.indexOf(value) !== -1;
      		},
      		handleNodeClick(data){
        		this.dataId = data.id;
        		this.getKcCircleListPeople();
			},
			cityArrChange(data){
				this.proviceid = data[0];
				if(data[1]!=undefined){
					this.cityid = data[1];
				}else{
					this.cityid = '';
				};
				if(data[2]!=undefined){
					this.regionid = data[2];
				}else{
					this.regionid = '';
				};
				this.getKcCircleListPeople();
			},
			getKcCircleListPeople(){
				this.$ajax({
					url: this.$root.jifuUrl + "/getUserByOrganizationId?"+'page='+this.currentpage+'&num='+this.pagesize+'&rootcompanyid=1'+'&name='+this.studyKeySearch+'&organizationId='+this.dataId+'&proviceid='+this.proviceid+'&cityid='+this.cityid+'&regionid='+this.regionid,
					method: 'GET',
					data: {},
					success: res => {
						if(res.data.code == 200) {
							this.tableData = res.data.data.list;
							this.total=res.data.data.pageParam.items;
							if(this.nowType=='edit'){
								setTimeout(() => {
								　　 this.rowMultipleCheckedPeople();
								}, 200)
							}
						}
					}
				})
			},
			//回显选中结果
			rowMultipleCheckedPeople(){
				var selectPeoples=[];
				this.peopleSelectIds.forEach(element =>{
					selectPeoples.push(parseInt(element))
				})
				if(selectPeoples!=null){
					this.tableData.forEach(element => {
						if(selectPeoples.indexOf(element.id)>=0){
							this.$refs.multipleTable.toggleRowSelection(element);
						}
					});
				}
			},
			handleSelectionChangePeople(val) {
				this.multipleSelectionPeople = [];
				this.courseSelectNamesMulPeople = [];
				for(var i = 0;i<val.length;i++){
					this.multipleSelectionPeople.push(val[i].id);
					this.multipleSelectionNamePeople.push(val[i].courseName);
					this.courseSelectNamesMulPeople.push({
						id:val[i].id,
						peopleName:val[i].nickname
					});
				}
				console.log('xueza:',this.multipleSelectionPeople,this.courseSelectNamesMulPeople);
			},
			peopleSelectWrapSubmit(){
				this.peopleSelectIds = this.multipleSelectionPeople;
				this.peopleSelectNames = this.courseSelectNamesMulPeople;
//				console.log(this.peopleSelectIds,this.peopleSelectNames);
				this.peopleSelectWrap = false;
				this.auditPbefore = false;
				this.auditPafter = true;
			}, 
			peopleSelectClose(){
				this.peopleSelectWrap = false;
			},
			enter(item,index){
				this.$ajax({
					url: this.$root.jifuUrl + "/getUserInfoByUserid?"+'&userid='+item.id,
					method: 'GET',
					data: {},
					success: res => {
						if(res.data.code == 200) {
							let rebackRes = res.data.data;
							this.hover_headimg = rebackRes.headimg;
							this.hover_nickname = rebackRes.nickname;
							this.hover_gradeRuleName = rebackRes.gradeRuleName;
							this.hover_phone = rebackRes.phone;
							this.hover_organizationName = rebackRes.organizationName;
							this.hover_departmentName = rebackRes.departmentName;
							this.hover_stationName = rebackRes.stationName;
							this.hover_roleLabel = rebackRes.roleLabel;
						}
					}
				});
			},
			peopleEdit(){
				this.peopleSelectWrap = true;
				this.getOrganizationArr();
				this.getKcCircleListPeople();
			},
			peopleDelete(index){
				this.peopleSelectNames.splice(index,1);
				this.peopleSelectIds.splice(index,1);
			},
			handleCurrentChange(value) {
				this.currentpage = value;
				this.getKcCircleListPeople();
			},
      		getTreeDataCity(data){
				for(var i=0;i<data.length;i++){
					if(data[i].list.length<1){
						data[i].list=undefined;
					}else {
						this.getTreeDataCity(data[i].list);
					}
				}
				return data;
        	},
			toggleSelection(rows) {
				if(rows) {
					rows.forEach(row => {
						this.$refs.multipleTable.toggleRowSelection(row)
					})
					this.allSelect = !this.allSelect;
				}
			},
//			添加审核人员end
			reBack(){
				this.$router.push({
					name:'auditManager'
				});
			}
		},
		components: {
			alert
		},
		mounted(){
			this.getParams();
			this.$rootFunction().getAllCity();
			if(this.nowType == "edit"||this.nowType=='see') {
				console.log('306', this.nowType, this.$root.auditMsg);
				this.auditPbefore = false;
				this.auditPafter = true;  
				
				this.auditQxBefore = false;
				this.auditQxAfter = true;
				
				this.auditTeaBefore = false;
				this.auditTeaAfter = true;
				
				this.id = this.$root.auditMsg.id;
				this.rootcompanyid = this.$root.auditMsg.rootcompanyid;
				this.name = this.$root.auditMsg.name;
				
				this.userid = this.$root.auditMsg.userid.split(',');
				this.peopleSelectIds = this.$root.auditMsg.userid.split(',');
				console.log('ba;dk:',this.userid,this.peopleSelectIds);
				
				this.pcolumn = this.$root.auditMsg.pcolumn.split(',');
				this.ccolumn = this.$root.auditMsg.ccolumn.split(',');
				for(var i=0;i<this.pcolumn.length;i++){
					this.value1.push([this.pcolumn[i],this.ccolumn[i]]);
				}
				
				this.lecturerids = this.$root.auditMsg.lecturerid.split(',');
				this.lecturerNames = this.$root.auditMsg.lnickname.split(',');

				let editUserNickName = this.$root.auditMsg.unickname.split(',');
				editUserNickName.forEach(element => {
					this.peopleSelectNames.push({
						peopleName:element
					});
				});
				if(this.$root.auditMsg.type!=null){
					let editTaskNotice = this.$root.auditMsg.type.split(',');
					editTaskNotice.forEach(element => {
						this.taskNoticeIds.push(parseInt(element));
						this.taskNotice.push(parseInt(element));
					})
				};
			}
			
		},
		watch: {
      		filterText(val) {
        		this.$refs.tree.filter(val);
        	}
      	}
	}
</script>
<style>
	.createGrope{padding-bottom: 100px}
	.auditGrope{position: relative;overflow: hidden;padding: 10px 0}
	.auditGrope .dateDive .el-input__inner{padding:0 0 0 39px;}
	.auditGrope .dateDive em{color: #DCDFE6}
	.auditGrope .el-select,.auditGrope .el-input,.auditGrope input{width:200px;height: 33px;line-height: 33px;font-size: 14px;color: #999;}
	.auditGrope input{border: 1px solid #ccc;box-sizing: border-box;padding-left: 15px;}
	.auditGrope .el-input__icon{line-height: 34px}
	.auditGrope .tit{font-size:16px;color: #333;font-style: normal;color: #333;float: left;width: 100px;display: inline-block;text-align: right;}
	.auditGrope a{color: #44cef6;cursor: pointer;}
	.auditGrope i{font-style: normal;font-size: 14px;color: #888;display: inline-block;margin-left: 10px}
	.auditGrope .el-radio:nth-child(1){display: block;margin-bottom: 20px}
	.auditGrope .dateDive{position: absolute;top: 0;left: 158px}
	.auditGrope .warn{position: absolute;top: 46px;left: 158px}
	.auditGrope .pepCon{margin-top: 15px;width: 860px;overflow: hidden;}
	.auditGrope .pepCon .personHover{display: inline-block;background: #ebebeb;padding:10px;border-radius: 5px;font-size: 14px;text-align: center;position: relative;cursor: pointer;}
	.auditGrope .pepCon .personHover span{margin-bottom: 0!important}
	.auditGrope .pepCon .personHover a{position: absolute;top:0;right: 2px}

	.auditGrope .notice{margin-top: 28px;background: #ebebeb;padding:20px;border-radius: 5px;margin-left: 55px}
	.auditGrope .notice p{font-size:14px;color: #333;}
	.auditGrope .notice em{display: block;float: inherit;}
	.auditGrope .notice .el-checkbox-group{margin: 10px 0}
	.auditGrope .auditPeople{float: left;}
	.auditGrope .auditPeople span{color: #333;display: block;margin-right: 10px;margin-bottom: 6px}    
	.auditGrope .auditPeople span i{color: #44cef6}

	.auditGrope .el-radio-group .el-radio__input input{height: auto!important;line-height: auto!important}


	.courseSelectWrap{width: 900px;height: 500px;background: #fff;border: 1px solid #ccc;position: fixed;top: 50%;left: 50%;margin-top: -250px;margin-left: -375px;z-index: 999;border-radius: 10px;padding: 20px;box-sizing: border-box;font-size: 14px}
	.courseSelectWrap .footerButton a{margin-top: 25px}
	.courseSelectClose{width: 15px;height: 15px;position: absolute;top: 20px;right: 20px;cursor: pointer;}
	.courseSelectLine{margin: 10px 0 20px;height:35px;position: relative;}
	.courseSelectLine .el-cascader{position: absolute;top: -5px;right: 225px}
	.courseSelectLine .el-select,.courseSelectLine .el-input,.courseSelectLine input{height: 33px;line-height: 33px}
	.courseSelectLine .el-input__icon{line-height: 34px}
	.courseSelectLine .msearch{float: right;position: relative;}
	.courseSelectLine .msearch input{width: 200px;height: 33px;line-height: 33px;padding-left: 10px;border: 1px solid #DCDFE6;border-radius: 3px;font-size:14px;color: #999;box-sizing: border-box;}
	.courseSelectLine .msearch a{height: 33px;display: inline-block;position: absolute;top: 0;right: 0}
	.studyPag{margin-top: 15px;text-align: right;}
	.courseSelectWrap .el-table .cell,.courseSelectWrap .el-table th div,.courseSelectWrap .el-table--border td:first-child .cell,.courseSelectWrap .el-table--border th:first-child .cell {padding:0;text-align:center;}
	.courseSelectWrap .courseSelectLine .msearch input{font-size: 12px}
	.courseSelectWrap .el-table .cell{font-size: 12px;color: #000}
	.courseSelectWrap .el-tree-node__label{font-size: 12px}



	.createGrope .leftContent{width: 23%;float: left;border: 1px solid #ccc;height: 307px;overflow-x: hidden}
	.createGrope .leftContent .el-input{width: 90%;display: block;margin: 10px auto}
	.createGrope .leftContent .el-tree__empty-block{min-height: 40px;}
	.createGrope .leftContent .el-tree__empty-block .el-tree__empty-text{font-size: 14px;}
	.rightContent{width: 75%;float: right;height: 307px;overflow-x: hidden;}

	.infoDetail span{display: block;margin-bottom: 10px}
	.infoDetail .iconImg{overflow: hidden;margin-bottom: 10px}
	.infoDetail .iconImg img{width: 50px;height: 50px;float: left;display: block;margin-right: 10px}
	.infoDetail .iconImg span{float: initial;display: block;}
	/*添加审核栏目组*/
	.auditColumnWrap{width: 500px;height: 300px;background: #fff;border: 1px solid #ccc;position: fixed;top: 50%;left: 50%;margin-top: -150px;margin-left: -250px;z-index: 999;border-radius: 10px;padding: 20px;box-sizing: border-box;font-size: 14px}
	.auditColumnClose{width: 15px;height: 15px;position: absolute;top: 20px;right: 20px;cursor: pointer;}
	.auditColumnWrap p{font-size: 16px;margin-bottom: 30px;}
	.auditColumnWrap .el-cascader,.auditColumnWrap .el-cascader .el-input,.auditColumnWrap .el-cascader .el-input input{width: 470px;font-size: 14px;height: auto;}
	.auditColumnWrap .footerButton{position: absolute;bottom: 30px;}
	.auditColumnWrap .footerButton a{margin-left: 53px;margin-top: 0;}
	.auditColumnWrap .footerButton a.cancel{margin-left: 123px;}
	.auditColumnWrap .el-tag .el-icon-close{width: 0;height: 0;display: none;}
	
	/*添加讲师*/
	.teacherSelect{width: 800px;height: 500px;background: #fff;border: 1px solid #ccc;position: fixed;top: 50%;left: 50%;margin-top: -245px;margin-left: -400px;z-index: 999;border-radius: 10px;padding: 20px;box-sizing: border-box;font-size: 12px;overflow-x: hidden;}
	.teacherSelectClose{width: 15px;height: 15px;position: absolute;top: 20px;right: 20px;cursor: pointer;}
	.teacherSelect p{font-size: 16px;margin-bottom: 30px;}
	.teacherSelect .el-table td{padding: 6px 0;text-align: center;}
	.auditBefore{float: left;}
	.auditBefore span{color: #333;display: block;margin-right: 10px;margin-bottom: 6px;}
	.teacherSelect .footerButton a{margin-left: 158px;margin-top: 30px;}
</style>